<template>
	<view class="invoiceRecord">
		<uv-navbar title="开票记录" @leftClick="goBack" bgColor="#277CC0" :placeholder="true"
			titleStyle="color:#FFFFFF;fontWeight:500" leftIconColor="#FFFFFF"></uv-navbar>
		<view class="recordBox" v-for="(i,n) in dataList" :key="n">
			<view class="recordMoney">
				￥{{i.amount}}
			</view>
			<view class="recordInfo" >
				<view class="infoItem">
					发票抬头：{{i.header_name}}
				</view>
				<view class="infoItem">
					申请时间：{{i.createtime}}
				</view>
				<view class="infoItem">
					发票类型：{{i.category=='1'?'普通发票':'增值发票'}}
				</view>
				<view class="infoItem">
					开票状态：<text>{{i.status==0?"审核中":i.status==1?"已开具":"已取消"}}</text>
				</view>
			</view>
		</view>
        <view class="" v-if="dataList.length==0">
            <uv-empty mode="data" icon="https://cdn.uviewui.com/uview/empty/data.png"></uv-empty>
        </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                dataList:[]
			};
		},
        onLoad() {
                this.getList()
        },
		methods:{
            async  getList(){
                   const {data} =  await this.$api.invoiceList()
                   this.dataList =data.list
            },
			goBack(){
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.invoiceRecord {
		min-height: 100vh;
		background-color: RGBA(245, 245, 245, 1);
		padding-top: 24rpx;
		padding-bottom: 24rpx;

		.recordBox {
			width: 710rpx;
			height: 194rpx;
			margin: 0 auto;
			margin-bottom: 19rpx;
			border-radius: 12rpx;
			background-color: #FFFFFF;
			overflow: hidden;
            display: flex;
			.recordMoney {
				width: 241rpx;
				height: 194rpx;
				background-color: RGBA(39, 124, 192, 1);
				color: #FFFFFF;
				font-size: 40rpx;
				line-height: 194rpx;
				text-align: center;
			}
			.recordInfo{
				padding-top: 22rpx;
				font-size: 22rpx;
				margin-left: 27rpx;
				color: #444444;
				.infoItem{
					margin-bottom: 12rpx;
				}
			}
		}
	}
</style>